<!--
+----------------------------------------------------------------------
| 友得云客  - 开启房产营销新纪元
+----------------------------------------------------------------------
| Copyright (c) 2019~2023 优得（西安）信息科技有限公司版权所有
+----------------------------------------------------------------------
| Licensed 友得云客不是自由软件 未经允许不可移除相关版权
+----------------------------------------------------------------------
| Author: www.youdeyunke.com
+----------------------------------------------------------------------
-->
<template>
    <el-dialog title="活动报名人员名单" :visible.sync="show" :fullscreen="false" :destroy-on-close="true" width="800px">
        <el-table :data="members" v-loading="loading">
            <!-- <el-table-column prop="id" label="#"></el-table-column> -->
            <el-table-column prop="tour_title" label="活动"></el-table-column>
            <el-table-column prop="mobile" label="手机号"></el-table-column>
            <el-table-column prop="name" label="姓名" width="80"></el-table-column>
            <el-table-column prop="numbers" label="人数" width="60"></el-table-column>
            <el-table-column prop="created_at" label="时间" width="160"></el-table-column>
            <el-table-column prop="remark" label="备注">
                <template slot-scope="scope">
                    <ud-tooltip :text="scope.row.remark"></ud-tooltip>
                </template>
            </el-table-column>
        </el-table>

        <div slot="footer">
            <el-button size="mini" @click="downloadCsv" :disabled="members.length == 0 || loading" :loading="loading" icon="el-icon-download">下载excel</el-button>
        </div>
    </el-dialog>
</template>

<script>
import { getToken } from "@/utils/auth";
import { getTourMembers, downloadTourMembers, } from "@/api/tour";
export default {
    data: function () {
        return {
            show: false,
            loading: true,
            tourId: null,
            members: [],
        };
    },

    methods: {
        downloadCsv: function () {
            const tourId = this.tourId;
            var _this = this;
            this.loading = true;
            downloadTourMembers(tourId)
                .then((res) => {
                    const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });

                    // 创建一个a标签
                    const link = document.createElement('a');
                    link.href = URL.createObjectURL(blob); // 设置文件的URL
                    link.download = '活动报名表.xlsx'; // 设置文件的下载名称

                    // 模拟用户点击链接进行下载
                    link.click();

                    // 释放URL对象
                    URL.revokeObjectURL(link.href);
                })
                .finally(() => {
                    this.loading = false;
                });
        },

        openDialog: function (tourId) {
            this.tourId = tourId;
            this.show = true;
            this.loading = true;
            getTourMembers(tourId).then((res) => {
                this.members = res.data.map((m) => {
                    m.signed = m.signed == true ? '是' : '否'
                    return m
                });
                this.loading = false;
            });
        },
    },
};
</script>

<style></style>